<template>
    <div class="px-16 py-4" style="background: rgb(245, 246, 247)">
      <div>
        <button
          class="bg-sky-500 p-1 px-3 font-bold hover:bg-sky-600 rounded-xl text-white shadow-md shadow-sky-300 mb-2"
        >
          博客发布
        </button>
        <button
          class="ml-4 bg-sky-500 p-1 px-3 font-bold hover:bg-sky-600 rounded-xl text-white shadow-md shadow-sky-300 mb-2"
          @click="toExamplePublish"
        >
          示例发布
        </button>
      </div>
      <div class="flex">
        <ul class="menu w-60 rounded-box">
          <li><a>博客管理</a></li>
          <li class="bordered"><a>示例管理</a></li>
        </ul>
        <div style="width: 1536px;background: #fff;min-height: 900px;">
          <div v-for="item in exampleList" :key="item.id" class="stat">
            <div class="stat-title link link-primary">
              {{ item.example_title }}
            </div>
            <div class="stat-value">阅读量: {{ item.example_viewcount }}</div>
            <div class="stat-desc">收藏量: {{ item.example_viewcount }}</div>
            <div class="badge badge-success gap-2">
              审核通过
            </div>
          </div>
        </div>
      </div>
    </div>
  </template>
  
  <script setup>
  import { findListPageByUserId } from "@/api/example";
  import { onMounted, ref } from "vue";
  import { useRouter } from "vue-router";
  import { useStore } from "vuex";
  
  const queryParams = {
    pageSize: 20,
    currentPage: 1,
    userid: -1,
  };
  const exampleList = ref([]);
  
  const store = useStore();
  const router = useRouter()
  
  const toExamplePublish = function(){
      router.push('/examplePublish')
  }
  
  onMounted(() => {
    let userinfo = store.state.qingUserInfo;
    if (userinfo.token) {
      queryParams.userid = userinfo.id;
      findListPageByUserId(queryParams).then((res) => {
        exampleList.value = res.list;
      });
    }
  });
  </script>
  
  <style>
  </style>